<template>
  <div class="wrap">
    <el-steps :space="90" align-center :active="3" finish-status="success" process-status="error" class="step-bar">
      <el-step title="上传应用"></el-step>
      <el-step title="完善资料"></el-step>
      <el-step title="等待审核"></el-step>
      <el-step title="审核未通过"></el-step>
    </el-steps>

    <div class="content-wrapper">
      <div class="icon-waiting">
        <img src="../../../../assets/frustrated.svg" alt="">
      </div>
      <h3>审核未通过,原因是:</h3>
      <ul class="reasonList">
        <li>1.应用中包含反动,色情等内容</li>
        <li>2.应用非法窃取用户信息</li>
        <li>3.应用卡顿严重,影响用户体验</li>
        <li>4.应用截图不符合规范</li>
      </ul>
      <p class="tip">提示:您可以点击下方<b>修改信息</b>按钮,修改后重新提交审核</p>
    </div>

    <div class="button-group">
      <el-button type="danger" @click="modify" style="margin-right:20px">修改信息</el-button>
      <el-button type="primary" @click="back">返回列表</el-button>
    </div>
  </div>
</template>

<script>
  export default {
    methods:{
      back(){
        this.$router.push('/application/app-entry/entry-list')
      },
      modify(){
        this.$router.push('/application/app-entry/upload-app/upload-file')
      }
    }
  }
</script>

<style lang="scss" scoped>
  .wrap{
    // display: flex;
    // flex-direction: column;
    // justify-content: center;
    .step-bar{
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 40px 0;
    }
    .content-wrapper{
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: 60px 0;
      // border-top: 1px solid #ccc;
      // border-bottom: 1px solid #ccc;
      .icon-waiting{
        width: 70px;
        height: 70px;
        margin-right: 20px;
        img{
          width: 100%;
          height: 100%;
        }
      }
      .reasonList{
        list-style-type: none;
      }
      .tip{
        font-size: 14px;
        color: rgb(189, 189, 189);
      }
    }
    .button-group{
      display: flex;
      justify-content: center;
      margin-top: 40px;
    }
  }
</style>
